<template>
  <div id="typettitle">
    <div class="title-top">
      <slot name="bigtitle"></slot>
      <slot v-if="isshowdesc" name="desccontent"></slot>
      <slot v-if="isshowmore" name="look"></slot>
    </div>

    <div class="title-bottom" v-if="isshowbottom">
      <slot name="title-desc"></slot>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {}
  },
  props: {
    //是否显示点击查看
    isshowmore: false,
    //是否显示解释文字
    isshowdesc: false,
    //是否显示下部分字
    isshowbottom: false,
  },
}
</script>

<style scoped lang='scss'>
#typettitle {
  .title-top {
    display: flex;
    align-items: center;
    h3 {
      font-size: 20px;
      color: #333;
    }
    p {
      font-weight: 400;
      font-size: 14px;
      color: #ff4d4f;
      margin-left: 10px;
      margin-left: 20px;
    }
    span {
      font-weight: 400;
      font-size: 14px;
      color: #5b76f9;
      margin-left: 15px;
      cursor: pointer;
    }
  }
  .title-bottom {
    p {
      width: 100%;
      height: 44px;
      font-size: 14px;
      font-family: PingFangSC-Medium, PingFang SC;
      font-weight: 500;
      color: #ff4d4f;
      line-height: 20px;
    }
  }
}
</style>